<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>axios-别名(查询所有用户)</title>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script type="module">
        // 引入vue3
        import {createApp} from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js'
        createApp({
            data() {
                return {
                    users: []
                }
            },
            mounted() {
                // 获取所有用户
                axios.get('http://localhost:8099/users/all').then((response) => {
                    this.users = response.data.data
                }).catch((error) => {
                    console.log(error)
                })
            }
        }).mount('#app')
</script>
</head>
<body>
<div id="app">
    <div v-for="user in users">
        <span>ID:{{user.id}}</span>
        <span>用户名:{{user.username}}</span>
        <span>手机号:{{user.phone}}</span>
        <span>详细信息:{{user.info}}</span>
        <span>余额:{{user.balance}}</span>
        <a href="">修改</a>
        <a href="">删除</a>
    </div>
</div>
</body>
</html>